/* eslint-disable react/prop-types */
import { hasToken } from '@/utils/storage'
import { useLocation, Route, Redirect } from 'react-router-dom'

function PrivateRoute ({ component: Com, path, ...rest }) {
  const location = useLocation()
  //   console.log(props)
  //   return <div>xxxx</div>
  // 封装一个组件，它与Route有相同的功能 + 权限控制（检查token）
  return (
    <Route
      {...rest}
      path={path}
      render={() => {
        if (hasToken()) {
          return <Com />
        } else {
          console.log('没有token,我们自己写了守卫，回去登录')
          return (
            <Redirect
              to={{ pathname: '/login', state: { backto: location.pathname } }}
            />
          )
        }
      }}
    />
  )
  // <Route render={() => {
  //   if (hasToken()) {
  //     return <Layout/>
  //   } else {
  //     console.log('没有token,我们自己写了守卫，回去登录')
  //     return <Redirect to="/login"></Redirect>
  //   }
  // }} path='/home'></Route>
}
export default PrivateRoute
